/*
 * Copyright (c) 2025 Huawei Device Co., Ltd.
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import 'package:adaptive_layout_sample/main.dart';
import 'package:flutter/material.dart';
import 'package:hadss_adaptive_layout/hadss_adaptive_layout.dart';
import 'package:provider/provider.dart';

import './components/banner.dart';
import './components/entrances.dart';
import './components/grid.dart';
import './components/top.dart';
import '../../l10n/generated/app_localizations.dart';

class VideoHomePage extends StatefulWidget {
  const VideoHomePage({super.key});

  @override
  State<VideoHomePage> createState() => _VideoHomePageState();
}

class _VideoHomePageState extends State<VideoHomePage>
    with WidgetsBindingObserver {
  final int _currentIndex = 0;
  late double _currentWidth = 0;
  late double _currentHeight = 0;
  late WidthBreakpoint screenType;
  late String textFieldValue = '';
  late num topCurrentIndex = 0;

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addObserver(this);
    updateScreenSize();
  }

  @override
  void dispose() {
    WidgetsBinding.instance.removeObserver(this);
    super.dispose();
  }

  @override
  void didChangeMetrics() {
    updateScreenSize();
  }

  void updateScreenSize() {
    final Size size = WidgetsBinding.instance.window.physicalSize;
    final double ratio = WidgetsBinding.instance.window.devicePixelRatio;
    setState(() {
      _currentWidth = size.width / ratio;
      _currentHeight = size.height / ratio;
    });
  }

  Widget _buildVerticalNavButton(String label, int index,
      {required Widget activeIcon, Widget? deActiveIcon}) {
    deActiveIcon ??= activeIcon;
    return InkWell(
      child: Container(
        padding: const EdgeInsets.symmetric(vertical: 26),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            _currentIndex == index ? activeIcon : deActiveIcon,
            Text(label,
                style: TextStyle(
                    color: _currentIndex == index
                        ? const Color(0xFFED6F21)
                        : const Color.fromRGBO(0, 0, 0, 0.6))),
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Consumer<RouteManager>(builder: (context, provider, child) {
      screenType = provider.widthBreakpoint;
      return _contentView(context);
    });
  }

  Widget _contentView(BuildContext context) {
    // 获取本地化字符串
    AppLocalizations il8n = AppLocalizations.of(context)!;
    // 定义侧边栏列表
    List sideBarList = [
      {
        'imgUrl': 'lib/assets/images/tabs/5.png',
        'name': il8n.homePage,
        'index': 0
      },
      {'imgUrl': 'lib/assets/images/tabs/4.png', 'name': il8n.post, 'index': 1},
      {
        'imgUrl': 'lib/assets/images/tabs/1.png',
        'name': il8n.memberPurchase,
        'index': 2
      },
      {'imgUrl': 'lib/assets/images/tabs/2.png', 'name': il8n.me, 'index': 3}
    ];

    return Scaffold(
      appBar:
          screenType == WidthBreakpoint.lg || screenType == WidthBreakpoint.xl
              ? null
              : AppBar(
                  backgroundColor: const Color(0xFFFFFFFF),
                ),

      body: Container(
        height: _currentHeight,
        width: _currentWidth,
        decoration: const BoxDecoration(color: Colors.white),
        child: Row(
          children: [
            if (screenType == WidthBreakpoint.lg ||
                screenType == WidthBreakpoint.xl)
              Container(
                width: 80, // 调整宽度
                color: const Color(0xFFF1F3F5),
                child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: sideBarList.map((item) {
                      return _buildVerticalNavButton(
                          item["name"], item["index"],
                          activeIcon: Image.asset(
                            item["imgUrl"],
                            width: 24,
                            height: 24,
                          ));
                    }).toList()),
              ),
            Expanded(
              child: SizedBox(
                height: _currentHeight,
                child: SingleChildScrollView(
                  child: Container(
                    color: const Color(0xFFFFFFFF),
                    // padding: EdgeInsets.only(top: 10),
                    child: Column(
                      children: [
                        if (screenType == WidthBreakpoint.lg ||
                            screenType == WidthBreakpoint.xl)
                          const SizedBox(
                            height: 20,
                          ),
                        Head(
                          screenType: screenType,
                          currentWidth: _currentWidth,
                          currentIndex: topCurrentIndex,
                          textFieldValue: textFieldValue,
                          setTextTopValue: (v) {
                            topCurrentIndex = v;
                          },
                          setTextValue: (v) {
                            textFieldValue = v;
                          },
                        ),
                        InnerBanner(
                          screenType: screenType,
                          currentWidth: _currentWidth,
                        ),
                        Entrances(
                            screenType: screenType,
                            currentWidth: _currentWidth),
                        GridWidget(
                            screenType: screenType,
                            currentWidth: _currentWidth),
                        const SizedBox(
                          height: 30,
                        )
                      ],
                    ),
                  ),
                ),
              ),
            )
          ],
        ),
      ),
      bottomNavigationBar: screenType == WidthBreakpoint.lg ||
              screenType == WidthBreakpoint.xl
          ? null
          : BottomNavigationBar(
              currentIndex: _currentIndex,
              type: BottomNavigationBarType.fixed,
              selectedItemColor: const Color.fromARGB(255, 237, 111, 33),
              unselectedItemColor: Colors.grey,
              selectedLabelStyle: const TextStyle(
                height: 1.5, // 通过调整高度间接控制间距
                fontSize: 12.0,
              ),
              unselectedLabelStyle: const TextStyle(
                height: 1.5,
                fontSize: 12.0,
              ),
              items: sideBarList.map((item) {
                return BottomNavigationBarItem(
                  icon: Image.asset(
                    item["imgUrl"],
                    width: 24,
                    height: 24,
                  ),
                  activeIcon: Image.asset(
                    item["imgUrl"],
                    width: 24,
                    height: 24,
                  ),
                  label: item["name"],
                );
              }).toList()), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}
